$(function () {
    var page = 1;
    var pageSize = 2;

    //调接口,发送ajax请求,获得数据,渲染页面
    //将获取数据并渲染封装成函数,以便需要时调用
    function render() {
        $.ajax({
            url: '/category/queryTopCategoryPaging',
            type: 'get',
            data: {
                'page': page,
                'pageSize': pageSize

            },
            success: function (backData) {
                // console.log(backData);
                //取得数据后调用模板渲染数据
                var result = template('category-table', backData);
                //渲染数据
                $('.right .table tbody').html(result);
                //页码需要在获得数据后显示,所以放在ajax请求的里面
                $('#paginator').bootstrapPaginator({
                    bootstrapMajorVersion: 3, //指定分页插件版本,如果是版本3,必须指定
                    currentPage: page, //当前页
                    totalPages: Math.ceil(backData.total / pageSize), //总页数
                    size: 'small', //设置控件大小
                    onPageClicked: function (a, b, c, index) {
                        page = index;
                        render();
                    }


                })


            }
        })


    }

    //首次调用
    render();
    // 弹出添加分类模态框
    $('.add-category').click(function () {

        $('#addCategory').modal("show");
    })

    //表单验证
    var $form = $("form");
    //手动提交表单， 让下面的表单验证插件生效
    $("button[type=submit]").click(function () {
        $form.submit();
    });

    //设置验证规则
    $form.bootstrapValidator({
        //1. 设置验证状态对应的小图标
        feedbackIcons: {
            //如果验证通过，显示的小图标
            valid: 'glyphicon glyphicon-ok',
            //验证不通过
            invalid: 'glyphicon glyphicon-remove',
            //正在验证的状态
            validating: 'glyphicon glyphicon-refresh'
        },

        fields: {
            categoryName: {
                validators: {
                    //1. 规则,验证是否输入了字符
                    notEmpty: {
                        message: "分类不能为空"
                    }
                }
            },
        }
    });

    // //表单验证成功之后的事件处理
    $form.on("success.form.bv", function (target) {
        //阻止默认事件（提交表单）
        target.preventDefault();
        //    alert("表单验证通过");
        $.ajax({
            url: "/category/addTopCategory",
            type: "post",
            data: $form.serialize(),
            success: function (data) {
                console.log($form.serialize());
                //    console.log(data);
                if (data.success) {
                    //刷新页面数据
                    render();

                    //把模态框隐藏
                    $("#addCategory").modal("hide");
                }
            },

        });
    });
})